<%- include('./partials/header') %>

<script>
  // Credit: https://codepen.io/t7team/pen/ZowdRN
  function openTab(e, tabName) {
    let i, x, tabLinks;
    x = document.getElementsByClassName('content-tab');
    for (i = 0; i < x.length; i++) {
      x[i].style.display = 'none';
    }
    tabLinks = document.getElementsByClassName('tab');
    for (i = 0; i < x.length; i++) {
      tabLinks[i].className = tabLinks[i].className.replace(' is-active', '');
    }
    document.getElementById(tabName).style.display = 'block';
    e.className += ' is-active';
  }
</script>
<div class="normal-container">
    <div>
        <h2 class="title">配置页面</h2>
        <%- include('./partials/message') %>
        <% if(showPasswordWarning) { %>
            <article class="message is-warning">
                <div class="message-header">
                    <p>警告</p>
                </div>
                <div class="message-body">
                    你正在使用的密码是默认密码，请尽快修改！
                </div>
            </article>
        <% } %>
        <article class="message is-light">
            <div class="message-header">
                <p>注意</p>
            </div>
            <div class="message-body">
                如果遇到问题，请仔细阅读
                <a target="_blank"
                   href="https://github.com/songquanpeng/message-pusher/blob/master/README.md">README</a>，如果还不能解决，请提
                <a target="_blank"
                   href="https://github.com/songquanpeng/message-pusher/issues/new">issue</a>。
                <br />
                <br />
                如果本项目对你有意义，<a target="_blank" href="https://github.com/songquanpeng/message-pusher">请 ⭐ 该项目</a>，
                <del>这是我继续维护的主要动力</del>
                ，谢谢 :)。
            </div>
        </article>
        <form action="/configure" method="post">
            <div class="tabs">
                <ul>
                    <li class="tab is-active" onclick="openTab(this,'userTab')"><a>用户设置</a></li>
                    <li class="tab" onclick="openTab(this,'testTab')"><a>微信测试号设置</a></li>
                    <li class="tab" onclick="openTab(this,'corpTab')"><a>微信企业号设置</a></li>
                    <li class="tab" onclick="openTab(this,'emailTab')"><a>邮件推送设置</a></li>
                </ul>
            </div>

            <div id="userTab" class="content-tab">
                <div class="field">
                    <label class="label">用户名</label>
                    <div class="control">
                        <input class="input" name="username" value="<%- username; %>" type="text"
                               placeholder="请输入新的用户名">
                    </div>
                </div>
                <div class="field">
                    <label class="label">密码</label>
                    <div class="control">
                        <input class="input" name="password" type="text" placeholder="请输入新的密码">
                    </div>
                </div>
                <div class="field">
                    <label class="label">默认推送方式</label>
                    <article class="message">
                        <div class="message-body">
                            可选值有：test（使用微信测试号进行推送），corp（使用微信企业号进行推送），email（使用邮件进行推送）
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="defaultMethod" value="<%- defaultMethod; %>" type="text"
                               placeholder="请输入新的默认推送方式">
                    </div>
                </div>
                <div class="field">
                    <label class="label">前缀</label>
                    <article class="message">
                        <div class="message-body">
                            前缀默认和用户名相同，如非必要，无需修改
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="prefix" value="<%- prefix ? prefix : username; %>" type="text"
                               placeholder="请输入你的前缀">
                    </div>
                </div>

                <div class="field">
                    <label class="label">ACCESS TOKEN</label>
                    <article class="message">
                        <div class="message-body">
                            Access Token 可防止未授权者利用本系统向你发送消息，留空则不做该检查
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="accessToken" value="<%- accessToken; %>" type="text"
                               placeholder="请设置新的 ACCESS TOKEN（可不填）">
                    </div>
                </div>
            </div>
            <div id="testTab" class="content-tab" style="display:none">
                <article class="message">
                    <div class="message-body">
                        <a target="_blank"
                           href="https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index">微信公众平台测试号配置链接</a>
                        <br>
                        <br>
                        根据你在 config.js 中填写的 href 以及你的 prefix，你的接口验证 URL为：<%- verifyUrl; %>。
                        <br>
                    </div>
                </article>
                <div class="field">
                    <label class="label">APP ID</label>
                    <div class="control">
                        <input class="input" name="wechatAppId" value="<%- wechatAppId; %>" type="text"
                               placeholder="请输入 APP ID">
                    </div>
                </div>

                <div class="field">
                    <label class="label">APP SECRET</label>
                    <div class="control">
                        <input class="input" name="wechatAppSecret" value="<%- wechatAppSecret; %>" type="text"
                               placeholder="请输入 APP SECRET">
                    </div>
                </div>

                <div class="field">
                    <label class="label">OPEN ID</label>
                    <div class="control">
                        <input class="input" name="wechatOpenId" value="<%- wechatOpenId; %>" type="text"
                               placeholder="请输入你的 OPEN ID">
                    </div>
                </div>

                <div class="field">
                    <label class="label">TEMPLATE ID</label>
                    <div class="control">
                        <input class="input" name="wechatTemplateId" value="<%- wechatTemplateId; %>" type="text"

                               placeholder="请输入一个模板通知 ID">
                    </div>
                </div>

                <div class="field">
                    <label class="label">TOKEN</label>
                    <div class="control">
                        <input class="input" name="wechatVerifyToken" value="<%- wechatVerifyToken; %>" type="text"

                               placeholder="请输入你的 TOKEN">
                    </div>
                </div>
            </div>
            <div id="corpTab" class="content-tab" style="display:none">
                <article class="message">
                    <div class="message-body">
                        <a target="_blank" href="https://work.weixin.qq.com/">在此处注册微信企业号</a>，之后<a target="_blank"
                                                                                                  href="https://work.weixin.qq.com/wework_admin/frame#profile/wxPlugin">在此处扫码关注</a>，
                        再之后<a target="_blank"
                              href="https://work.weixin.qq.com/wework_admin/frame#apps">在此处创建一个应用</a>。
                        <br>
                    </div>
                </article>
                <div class="field">
                    <label class="label">企业 ID</label>
                    <article class="message">
                        <div class="message-body">
                            <a target="_blank"
                               href="https://work.weixin.qq.com/wework_admin/frame#profile">在此处找到企业 ID</a>
                            <br>
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="corpId" value="<%- corpId; %>" type="text"
                               placeholder="请输入企业 ID">
                    </div>
                </div>
                <div class="field">
                    <label class="label">应用 AgentId</label>
                    <article class="message">
                        <div class="message-body">
                            应用详情页可找到
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="corpAgentId" value="<%- corpAgentId; %>" type="text"
                               placeholder="请输入应用的 AgentId">
                    </div>
                </div>
                <div class="field">
                    <label class="label">应用 Secret</label>
                    <article class="message">
                        <div class="message-body">
                            应用详情页可找到
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="corpAppSecret" value="<%- corpAppSecret; %>" type="text"
                               placeholder="请输入应用的 Secret">
                    </div>
                </div>
                <div class="field">
                    <label class="label">用户账号</label>
                    <article class="message">
                        <div class="message-body">
                            <a target="_blank"
                               href="https://work.weixin.qq.com/wework_admin/frame#contacts">在此处找到你的用户账号</a>
                            <br>
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="corpUserId" value="<%- corpUserId; %>" type="text"
                               placeholder="请输入你的 corpUserId">
                    </div>
                </div>
            </div>
            <div id="emailTab" class="content-tab" style="display:none">
                <div class="field">
                    <label class="label">默认目标邮箱</label>
                    <article class="message">
                        <div class="message-body">
                            要用 QQ 邮箱或者 Foxmail 邮箱，否则将无法通过微信得到邮件消息提醒
                        </div>
                    </article>
                    <div class="control">
                        <input class="input" name="email" value="<%- email; %>" type="email" placeholder="请输入你的邮箱（可不填）">
                    </div>
                </div>

                <div class="field">
                    <label class="label">SMTP 服务器地址</label>
                    <div class="control">
                        <input class="input" name="smtpServer" value="<%- smtpServer; %>" type="text"
                               placeholder="如 smtp.qq.com">
                    </div>
                </div>

                <div class="field">
                    <label class="label">SMTP 账号</label>
                    <div class="control">
                        <input class="input" name="smtpUser" value="<%- smtpUser; %>" type="email"
                               placeholder="请输入 SMTP 账号（是一个邮箱地址）">
                    </div>
                </div>

                <div class="field">
                    <label class="label">SMTP 凭据</label>
                    <div class="control">
                        <input class="input" name="smtpPass" type="text" placeholder="请输入新的 SMTP Token">
                    </div>
                </div>
            </div>
            <div class="field is-grouped is-grouped-right" style="margin-top: 16px">
                <div class="control">
                    <input type="submit" class="button is-light" value="提交">
                </div>
                <div class="control">
                    <input type="reset" class="button is-light" value="重置">
                </div>
            </div>
        </form>

    </div>
</div>


<%- include('./partials/footer') %>

